// gauge.js, This version modified by karminski. The donut style gauge has been changed. 
(function () {
    var AnimatedText, AnimatedTextFactory, Bar, BaseDonut, BaseGauge, Donut, Gauge, GaugePointer, TextRenderer, ValueUpdater, addCommas, cutHex, formatNumber, mergeObjects, secondsToString,
        slice = [].slice,
        hasProp = {}.hasOwnProperty,
        extend = function (child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
        indexOf = [].indexOf || function (item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; };

    (function () {
        var browserRequestAnimationFrame, isCancelled, j, lastId, len, vendor, vendors;
        vendors = ['ms', 'moz', 'webkit', 'o'];
        for (j = 0, len = vendors.length; j < len; j++) {
            vendor = vendors[j];
            if (window.requestAnimationFrame) {
                break;
            }
            window.requestAnimationFrame = window[vendor + 'RequestAnimationFrame'];
            window.cancelAnimationFrame = window[vendor + 'CancelAnimationFrame'] || window[vendor + 'CancelRequestAnimationFrame'];
        }
        browserRequestAnimationFrame = null;
        lastId = 0;
        isCancelled = {};
        if (!requestAnimationFrame) {
            window.requestAnimationFrame = function (callback, element) {
                var currTime, id, lastTime, timeToCall;
                currTime = new Date().getTime();
                timeToCall = Math.max(0, 16 - (currTime - lastTime));
                id = window.setTimeout(function () {
                    return callback(currTime + timeToCall);
                }, timeToCall);
                lastTime = currTime + timeToCall;
                return id;
            };
            return window.cancelAnimationFrame = function (id) {
                return clearTimeout(id);
            };
        } else if (!window.cancelAnimationFrame) {
            browserRequestAnimationFrame = window.requestAnimationFrame;
            window.requestAnimationFrame = function (callback, element) {
                var myId;
                myId = ++lastId;
                browserRequestAnimationFrame(function () {
                    if (!isCancelled[myId]) {
                        return callback();
                    }
                }, element);
                return myId;
            };
            return window.cancelAnimationFrame = function (id) {
                return isCancelled[id] = true;
            };
        }
    })();

    secondsToString = function (sec) {
        var hr, min;
        hr = Math.floor(sec / 3600);
        min = Math.floor((sec - (hr * 3600)) / 60);
        sec -= (hr * 3600) + (min * 60);
        sec += '';
        min += '';
        while (min.length < 2) {
            min = '0' + min;
        }
        while (sec.length < 2) {
            sec = '0' + sec;
        }
        hr = hr ? hr + ':' : '';
        return hr + min + ':' + sec;
    };

    formatNumber = function () {
        var digits, num, value;
        num = 1 <= arguments.length ? slice.call(arguments, 0) : [];
        value = num[0];
        digits = 0 || num[1];
        return addCommas(value.toFixed(digits));
    };

    mergeObjects = function (obj1, obj2) {
        var key, out, val;
        out = {};
        for (key in obj1) {
            if (!hasProp.call(obj1, key)) continue;
            val = obj1[key];
            out[key] = val;
        }
        for (key in obj2) {
            if (!hasProp.call(obj2, key)) continue;
            val = obj2[key];
            out[key] = val;
        }
        return out;
    };

    addCommas = function (nStr) {
        var rgx, x, x1, x2;
        nStr += '';
        x = nStr.split('.');
        x1 = x[0];
        x2 = '';
        if (x.length > 1) {
            x2 = '.' + x[1];
        }
        rgx = /(\d+)(\d{3})/;
        while (rgx.test(x1)) {
            x1 = x1.replace(rgx, '$1' + ',' + '$2');
        }
        return x1 + x2;
    };

    cutHex = function (nStr) {
        if (nStr.charAt(0) === "#") {
            return nStr.substring(1, 7);
        }
        return nStr;
    };

    ValueUpdater = (function () {
        ValueUpdater.prototype.animationSpeed = 32;

        function ValueUpdater(addToAnimationQueue, clear) {
            if (addToAnimationQueue == null) {
                addToAnimationQueue = true;
            }
            this.clear = clear != null ? clear : true;
            if (addToAnimationQueue) {
                AnimationUpdater.add(this);
            }
        }

        ValueUpdater.prototype.update = function (force) {
            var diff;
            if (force == null) {
                force = false;
            }
            if (force || this.displayedValue !== this.value) {
                if (this.ctx && this.clear) {
                    this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
                }
                diff = this.value - this.displayedValue;
                if (Math.abs(diff / this.animationSpeed) <= 0.001) {
                    this.displayedValue = this.value;
                } else {
                    this.displayedValue = this.displayedValue + diff / this.animationSpeed;
                }
                this.render();
                return true;
            }
            return false;
        };

        return ValueUpdater;

    })();

    BaseGauge = (function (superClass) {
        extend(BaseGauge, superClass);

        function BaseGauge() {
            return BaseGauge.__super__.constructor.apply(this, arguments);
        }

        BaseGauge.prototype.displayScale = 1;

        BaseGauge.prototype.forceUpdate = true;

        BaseGauge.prototype.setTextField = function (textField, fractionDigits) {
            return this.textField = textField instanceof TextRenderer ? textField : new TextRenderer(textField, fractionDigits);
        };

        BaseGauge.prototype.setMinValue = function (minValue, updateStartValue) {
            var gauge, j, len, ref, results;
            this.minValue = minValue;
            if (updateStartValue == null) {
                updateStartValue = true;
            }
            if (updateStartValue) {
                this.displayedValue = this.minValue;
                ref = this.gp || [];
                results = [];
                for (j = 0, len = ref.length; j < len; j++) {
                    gauge = ref[j];
                    results.push(gauge.displayedValue = this.minValue);
                }
                return results;
            }
        };

        BaseGauge.prototype.setOptions = function (options) {
            if (options == null) {
                options = null;
            }
            this.options = mergeObjects(this.options, options);
            if (this.textField) {
                this.textField.el.style.fontSize = options.fontSize + 'px';
            }
            this.configDisplayScale();
            return this;
        };

        BaseGauge.prototype.configDisplayScale = function () {
            var backingStorePixelRatio, devicePixelRatio, height, prevDisplayScale, width;
            prevDisplayScale = this.displayScale;
            if (this.options.highDpiSupport === false) {
                delete this.displayScale;
            } else {
                devicePixelRatio = window.devicePixelRatio || 1;
                backingStorePixelRatio = this.ctx.webkitBackingStorePixelRatio || this.ctx.mozBackingStorePixelRatio || this.ctx.msBackingStorePixelRatio || this.ctx.oBackingStorePixelRatio || this.ctx.backingStorePixelRatio || 1;
                this.displayScale = devicePixelRatio / backingStorePixelRatio;
            }
            if (this.displayScale !== prevDisplayScale) {
                width = this.canvas.G__width || this.canvas.width;
                height = this.canvas.G__height || this.canvas.height;
                this.canvas.width = width * this.displayScale;
                this.canvas.height = height * this.displayScale;
                this.canvas.style.width = width + "px";
                this.canvas.style.height = height + "px";
                this.canvas.G__width = width;
                this.canvas.G__height = height;
            }
            return this;
        };

        BaseGauge.prototype.parseValue = function (value) {
            value = parseFloat(value) || Number(value);
            if (isFinite(value)) {
                return value;
            } else {
                return 0;
            }
        };

        return BaseGauge;

    })(ValueUpdater);

    TextRenderer = (function () {
        function TextRenderer(el, fractionDigits1) {
            this.el = el;
            this.fractionDigits = fractionDigits1;
        }

        TextRenderer.prototype.render = function (gauge) {
            return this.el.innerHTML = formatNumber(gauge.displayedValue, this.fractionDigits);
        };

        return TextRenderer;

    })();

    AnimatedText = (function (superClass) {
        extend(AnimatedText, superClass);

        AnimatedText.prototype.displayedValue = 0;

        AnimatedText.prototype.value = 0;

        AnimatedText.prototype.setVal = function (value) {
            return this.value = 1 * value;
        };

        function AnimatedText(elem1, text) {
            this.elem = elem1;
            this.text = text != null ? text : false;
            AnimatedText.__super__.constructor.call(this);
            if (this.elem === void 0) {
                throw new Error('The element isn\'t defined.');
            }
            this.value = 1 * this.elem.innerHTML;
            if (this.text) {
                this.value = 0;
            }
        }

        AnimatedText.prototype.render = function () {
            var textVal;
            if (this.text) {
                textVal = secondsToString(this.displayedValue.toFixed(0));
            } else {
                textVal = addCommas(formatNumber(this.displayedValue));
            }
            return this.elem.innerHTML = textVal;
        };

        return AnimatedText;

    })(ValueUpdater);

    AnimatedTextFactory = {
        create: function (objList) {
            var elem, j, len, out;
            out = [];
            for (j = 0, len = objList.length; j < len; j++) {
                elem = objList[j];
                out.push(new AnimatedText(elem));
            }
            return out;
        }
    };

    GaugePointer = (function (superClass) {
        extend(GaugePointer, superClass);

        GaugePointer.prototype.displayedValue = 0;

        GaugePointer.prototype.value = 0;

        GaugePointer.prototype.options = {
            strokeWidth: 0.035,
            length: 0.1,
            color: "#000000",
            iconPath: null,
            iconScale: 1.0,
            iconAngle: 0
        };

        GaugePointer.prototype.img = null;

        function GaugePointer(gauge1) {
            this.gauge = gauge1;
            if (this.gauge === void 0) {
                throw new Error('The element isn\'t defined.');
            }
            this.ctx = this.gauge.ctx;
            this.canvas = this.gauge.canvas;
            GaugePointer.__super__.constructor.call(this, false, false);
            this.setOptions();
        }

        GaugePointer.prototype.setOptions = function (options) {
            if (options == null) {
                options = null;
            }
            this.options = mergeObjects(this.options, options);
            this.length = 2 * this.gauge.radius * this.gauge.options.radiusScale * this.options.length;
            this.strokeWidth = this.canvas.height * this.options.strokeWidth;
            this.maxValue = this.gauge.maxValue;
            this.minValue = this.gauge.minValue;
            this.animationSpeed = this.gauge.animationSpeed;
            this.options.angle = this.gauge.options.angle;
            if (this.options.iconPath) {
                this.img = new Image();
                return this.img.src = this.options.iconPath;
            }
        };

        GaugePointer.prototype.render = function () {
            var angle, endX, endY, imgX, imgY, startX, startY, x, y;
            angle = this.gauge.getAngle.call(this, this.displayedValue);
            x = Math.round(this.length * Math.cos(angle));
            y = Math.round(this.length * Math.sin(angle));
            startX = Math.round(this.strokeWidth * Math.cos(angle - Math.PI / 2));
            startY = Math.round(this.strokeWidth * Math.sin(angle - Math.PI / 2));
            endX = Math.round(this.strokeWidth * Math.cos(angle + Math.PI / 2));
            endY = Math.round(this.strokeWidth * Math.sin(angle + Math.PI / 2));
            this.ctx.beginPath();
            this.ctx.fillStyle = this.options.color;
            this.ctx.arc(0, 0, this.strokeWidth, 0, Math.PI * 2, false);
            this.ctx.fill();
            this.ctx.beginPath();
            this.ctx.moveTo(startX, startY);
            this.ctx.lineTo(x, y);
            this.ctx.lineTo(endX, endY);
            this.ctx.fill();
            if (this.img) {
                imgX = Math.round(this.img.width * this.options.iconScale);
                imgY = Math.round(this.img.height * this.options.iconScale);
                this.ctx.save();
                this.ctx.translate(x, y);
                this.ctx.rotate(angle + Math.PI / 180.0 * (90 + this.options.iconAngle));
                this.ctx.drawImage(this.img, -imgX / 2, -imgY / 2, imgX, imgY);
                return this.ctx.restore();
            }
        };

        return GaugePointer;

    })(ValueUpdater);

    Bar = (function () {
        function Bar(elem1) {
            this.elem = elem1;
        }

        Bar.prototype.updateValues = function (arrValues) {
            this.value = arrValues[0];
            this.maxValue = arrValues[1];
            this.avgValue = arrValues[2];
            return this.render();
        };

        Bar.prototype.render = function () {
            var avgPercent, valPercent;
            if (this.textField) {
                this.textField.text(formatNumber(this.value));
            }
            if (this.maxValue === 0) {
                this.maxValue = this.avgValue * 2;
            }
            valPercent = (this.value / this.maxValue) * 100;
            avgPercent = (this.avgValue / this.maxValue) * 100;
            $(".bar-value", this.elem).css({
                "width": valPercent + "%"
            });
            return $(".typical-value", this.elem).css({
                "width": avgPercent + "%"
            });
        };

        return Bar;

    })();

    Gauge = (function (superClass) {
        extend(Gauge, superClass);

        Gauge.prototype.elem = null;

        Gauge.prototype.value = [20];

        Gauge.prototype.maxValue = 80;

        Gauge.prototype.minValue = 0;

        Gauge.prototype.displayedAngle = 0;

        Gauge.prototype.displayedValue = 0;

        Gauge.prototype.lineWidth = 40;

        Gauge.prototype.paddingTop = 0.1;

        Gauge.prototype.paddingBottom = 0.1;

        Gauge.prototype.percentColors = null;

        Gauge.prototype.options = {
            colorStart: "#6fadcf",
            colorStop: void 0,
            gradientType: 0,
            strokeColor: "#e0e0e0",
            pointer: {
                length: 0.8,
                strokeWidth: 0.035,
                iconScale: 1.0
            },
            angle: 0.15,
            lineWidth: 0.44,
            radiusScale: 1.0,
            fontSize: 40,
            limitMax: false,
            limitMin: false
        };

        function Gauge(canvas) {
            var h, w;
            this.canvas = canvas;
            Gauge.__super__.constructor.call(this);
            this.percentColors = null;
            if (typeof G_vmlCanvasManager !== 'undefined') {
                this.canvas = window.G_vmlCanvasManager.initElement(this.canvas);
            }
            this.ctx = this.canvas.getContext('2d');
            h = this.canvas.clientHeight;
            w = this.canvas.clientWidth;
            this.canvas.height = h;
            this.canvas.width = w;
            this.gp = [new GaugePointer(this)];
            this.setOptions();
        }

        Gauge.prototype.setOptions = function (options) {
            var gauge, j, len, phi, ref;
            if (options == null) {
                options = null;
            }
            Gauge.__super__.setOptions.call(this, options);
            this.configPercentColors();
            this.extraPadding = 0;
            if (this.options.angle < 0) {
                phi = Math.PI * (1 + this.options.angle);
                this.extraPadding = Math.sin(phi);
            }
            this.availableHeight = this.canvas.height * (1 - this.paddingTop - this.paddingBottom);
            this.lineWidth = this.availableHeight * this.options.lineWidth;
            this.radius = (this.availableHeight - this.lineWidth / 2) / (1.0 + this.extraPadding);
            this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
            ref = this.gp;
            for (j = 0, len = ref.length; j < len; j++) {
                gauge = ref[j];
                gauge.setOptions(this.options.pointer);
                gauge.render();
            }
            this.render();
            return this;
        };

        Gauge.prototype.configPercentColors = function () {
            var bval, gval, i, j, ref, results, rval;
            this.percentColors = null;
            if (this.options.percentColors !== void 0) {
                this.percentColors = new Array();
                results = [];
                for (i = j = 0, ref = this.options.percentColors.length - 1; 0 <= ref ? j <= ref : j >= ref; i = 0 <= ref ? ++j : --j) {
                    rval = parseInt((cutHex(this.options.percentColors[i][1])).substring(0, 2), 16);
                    gval = parseInt((cutHex(this.options.percentColors[i][1])).substring(2, 4), 16);
                    bval = parseInt((cutHex(this.options.percentColors[i][1])).substring(4, 6), 16);
                    results.push(this.percentColors[i] = {
                        pct: this.options.percentColors[i][0],
                        color: {
                            r: rval,
                            g: gval,
                            b: bval
                        }
                    });
                }
                return results;
            }
        };

        Gauge.prototype.set = function (value) {
            var gp, i, j, l, len, m, ref, ref1, val;
            if (!(value instanceof Array)) {
                value = [value];
            }
            for (i = j = 0, ref = value.length - 1; 0 <= ref ? j <= ref : j >= ref; i = 0 <= ref ? ++j : --j) {
                value[i] = this.parseValue(value[i]);
            }
            if (value.length > this.gp.length) {
                for (i = l = 0, ref1 = value.length - this.gp.length; 0 <= ref1 ? l < ref1 : l > ref1; i = 0 <= ref1 ? ++l : --l) {
                    gp = new GaugePointer(this);
                    gp.setOptions(this.options.pointer);
                    this.gp.push(gp);
                }
            } else if (value.length < this.gp.length) {
                this.gp = this.gp.slice(this.gp.length - value.length);
            }
            i = 0;
            for (m = 0, len = value.length; m < len; m++) {
                val = value[m];
                if (val > this.maxValue) {
                    if (this.options.limitMax) {
                        val = this.maxValue;
                    } else {
                        this.maxValue = val + 1;
                    }
                } else if (val < this.minValue) {
                    if (this.options.limitMin) {
                        val = this.minValue;
                    } else {
                        this.minValue = val - 1;
                    }
                }
                this.gp[i].value = val;
                this.gp[i++].setOptions({
                    minValue: this.minValue,
                    maxValue: this.maxValue,
                    angle: this.options.angle
                });
            }
            this.value = Math.max(Math.min(value[value.length - 1], this.maxValue), this.minValue);
            AnimationUpdater.add(this);
            AnimationUpdater.run(this.forceUpdate);
            return this.forceUpdate = false;
        };

        Gauge.prototype.getAngle = function (value) {
            return (1 + this.options.angle) * Math.PI + ((value - this.minValue) / (this.maxValue - this.minValue)) * (1 - this.options.angle * 2) * Math.PI;
        };

        Gauge.prototype.getColorForPercentage = function (pct, grad) {
            var color, endColor, i, j, rangePct, ref, startColor;
            if (pct === 0) {
                color = this.percentColors[0].color;
            } else {
                color = this.percentColors[this.percentColors.length - 1].color;
                for (i = j = 0, ref = this.percentColors.length - 1; 0 <= ref ? j <= ref : j >= ref; i = 0 <= ref ? ++j : --j) {
                    if (pct <= this.percentColors[i].pct) {
                        if (grad === true) {
                            startColor = this.percentColors[i - 1] || this.percentColors[0];
                            endColor = this.percentColors[i];
                            rangePct = (pct - startColor.pct) / (endColor.pct - startColor.pct);
                            color = {
                                r: Math.floor(startColor.color.r * (1 - rangePct) + endColor.color.r * rangePct),
                                g: Math.floor(startColor.color.g * (1 - rangePct) + endColor.color.g * rangePct),
                                b: Math.floor(startColor.color.b * (1 - rangePct) + endColor.color.b * rangePct)
                            };
                        } else {
                            color = this.percentColors[i].color;
                        }
                        break;
                    }
                }
            }
            return 'rgb(' + [color.r, color.g, color.b].join(',') + ')';
        };

        Gauge.prototype.getColorForValue = function (val, grad) {
            var pct;
            pct = (val - this.minValue) / (this.maxValue - this.minValue);
            return this.getColorForPercentage(pct, grad);
        };

        Gauge.prototype.renderStaticLabels = function (staticLabels, w, h, radius) {
            var font, fontsize, j, len, match, re, ref, rest, rotationAngle, value;
            this.ctx.save();
            this.ctx.translate(w, h);
            font = staticLabels.font || "10px Times";
            re = /\d+\.?\d?/;
            match = font.match(re)[0];
            rest = font.slice(match.length);
            fontsize = parseFloat(match) * this.displayScale;
            this.ctx.font = fontsize + rest;
            this.ctx.fillStyle = staticLabels.color || "#000000";
            this.ctx.textBaseline = "bottom";
            this.ctx.textAlign = "center";
            ref = staticLabels.labels;
            for (j = 0, len = ref.length; j < len; j++) {
                value = ref[j];
                if (value.label !== void 0) {
                    if ((!this.options.limitMin || value >= this.minValue) && (!this.options.limitMax || value <= this.maxValue)) {
                        font = value.font || staticLabels.font;
                        match = font.match(re)[0];
                        rest = font.slice(match.length);
                        fontsize = parseFloat(match) * this.displayScale;
                        this.ctx.font = fontsize + rest;
                        rotationAngle = this.getAngle(value.label) - 3 * Math.PI / 2;
                        this.ctx.rotate(rotationAngle);
                        this.ctx.fillText(formatNumber(value.label, staticLabels.fractionDigits), 0, -radius - this.lineWidth / 2);
                        this.ctx.rotate(-rotationAngle);
                    }
                } else {
                    if ((!this.options.limitMin || value >= this.minValue) && (!this.options.limitMax || value <= this.maxValue)) {
                        rotationAngle = this.getAngle(value) - 3 * Math.PI / 2;
                        this.ctx.rotate(rotationAngle);
                        this.ctx.fillText(formatNumber(value, staticLabels.fractionDigits), 0, -radius - this.lineWidth / 2);
                        this.ctx.rotate(-rotationAngle);
                    }
                }
            }
            return this.ctx.restore();
        };

        Gauge.prototype.renderTicks = function (ticksOptions, w, h, radius) {
            var currentDivision, currentSubDivision, divColor, divLength, divWidth, divisionCount, j, lineWidth, range, rangeDivisions, ref, results, scaleMutate, st, subColor, subDivisions, subLength, subWidth, subdivisionCount, t, tmpRadius;
            if (ticksOptions !== {}) {
                divisionCount = ticksOptions.divisions || 0;
                subdivisionCount = ticksOptions.subDivisions || 0;
                divColor = ticksOptions.divColor || '#fff';
                subColor = ticksOptions.subColor || '#fff';
                divLength = ticksOptions.divLength || 0.7;
                subLength = ticksOptions.subLength || 0.2;
                range = parseFloat(this.maxValue) - parseFloat(this.minValue);
                rangeDivisions = parseFloat(range) / parseFloat(ticksOptions.divisions);
                subDivisions = parseFloat(rangeDivisions) / parseFloat(ticksOptions.subDivisions);
                currentDivision = parseFloat(this.minValue);
                currentSubDivision = 0.0 + subDivisions;
                lineWidth = range / 400;
                divWidth = lineWidth * (ticksOptions.divWidth || 1);
                subWidth = lineWidth * (ticksOptions.subWidth || 1);
                results = [];
                for (t = j = 0, ref = divisionCount + 1; j < ref; t = j += 1) {
                    this.ctx.lineWidth = this.lineWidth * divLength;
                    scaleMutate = (this.lineWidth / 2) * (1 - divLength);
                    tmpRadius = (this.radius * this.options.radiusScale) + scaleMutate;
                    this.ctx.strokeStyle = divColor;
                    this.ctx.beginPath();
                    this.ctx.arc(0, 0, tmpRadius, this.getAngle(currentDivision - divWidth), this.getAngle(currentDivision + divWidth), false);
                    this.ctx.stroke();
                    currentSubDivision = currentDivision + subDivisions;
                    currentDivision += rangeDivisions;
                    if (t !== ticksOptions.divisions && subdivisionCount > 0) {
                        results.push((function () {
                            var l, ref1, results1;
                            results1 = [];
                            for (st = l = 0, ref1 = subdivisionCount - 1; l < ref1; st = l += 1) {
                                this.ctx.lineWidth = this.lineWidth * subLength;
                                scaleMutate = (this.lineWidth / 2) * (1 - subLength);
                                tmpRadius = (this.radius * this.options.radiusScale) + scaleMutate;
                                this.ctx.strokeStyle = subColor;
                                // this.ctx.beginPath();
                                // this.ctx.arc(0, 0, tmpRadius, this.getAngle(currentSubDivision - subWidth), this.getAngle(currentSubDivision + subWidth), false);
                                // this.ctx.stroke();
                                results1.push(currentSubDivision += subDivisions);
                            }
                            return results1;
                        }).call(this));
                    } else {
                        results.push(void 0);
                    }
                }
                return results;
            }
        };

        Gauge.prototype.render = function () {
            var displayedAngle, fillStyle, gauge, h, j, l, len, len1, max, min, radius, ref, ref1, scaleMutate, tmpRadius, w, zone;
            w = this.canvas.width / 2;
            h = (this.canvas.height * this.paddingTop + this.availableHeight) - ((this.radius + this.lineWidth / 2) * this.extraPadding);
            displayedAngle = this.getAngle(this.displayedValue);
            if (this.textField) {
                this.textField.render(this);
            }
            this.ctx.lineCap = "butt";
            radius = this.radius * this.options.radiusScale;
            if (this.options.staticLabels) {
                this.renderStaticLabels(this.options.staticLabels, w, h, radius);
            }
            if (this.options.staticZones) {
                this.ctx.save();
                this.ctx.translate(w, h);
                this.ctx.lineWidth = this.lineWidth;
                ref = this.options.staticZones;
                for (j = 0, len = ref.length; j < len; j++) {
                    zone = ref[j];
                    min = zone.min;
                    if (this.options.limitMin && min < this.minValue) {
                        min = this.minValue;
                    }
                    max = zone.max;
                    if (this.options.limitMax && max > this.maxValue) {
                        max = this.maxValue;
                    }
                    tmpRadius = this.radius * this.options.radiusScale;
                    if (zone.height) {
                        this.ctx.lineWidth = this.lineWidth * zone.height;
                        scaleMutate = (this.lineWidth / 2) * (zone.offset || 1 - zone.height);
                        tmpRadius = (this.radius * this.options.radiusScale) + scaleMutate;
                    }
                    this.ctx.strokeStyle = zone.strokeStyle;
                    this.ctx.beginPath();
                    this.ctx.arc(0, 0, tmpRadius, this.getAngle(min), this.getAngle(max), false);
                    this.ctx.stroke();
                }
            } else {
                if (this.options.customFillStyle !== void 0) {
                    fillStyle = this.options.customFillStyle(this);
                } else if (this.percentColors !== null) {
                    fillStyle = this.getColorForValue(this.displayedValue, this.options.generateGradient);
                } else if (this.options.colorStop !== void 0) {
                    if (this.options.gradientType === 0) {
                        fillStyle = this.ctx.createRadialGradient(w, h, 9, w, h, 70);
                    } else {
                        fillStyle = this.ctx.createLinearGradient(0, 0, w, 0);
                    }
                    fillStyle.addColorStop(0, this.options.colorStart);
                    fillStyle.addColorStop(1, this.options.colorStop);
                } else {
                    fillStyle = this.options.colorStart;
                }
                this.ctx.strokeStyle = fillStyle;
                this.ctx.beginPath();
                this.ctx.arc(w, h, radius, (1 + this.options.angle) * Math.PI, displayedAngle, false);
                this.ctx.lineWidth = this.lineWidth;
                this.ctx.stroke();
                this.ctx.strokeStyle = this.options.strokeColor;
                this.ctx.beginPath();
                this.ctx.arc(w, h, radius, displayedAngle, (2 - this.options.angle) * Math.PI, false);
                this.ctx.stroke();
                this.ctx.save();
                this.ctx.translate(w, h);
            }
            if (this.options.renderTicks) {
                this.renderTicks(this.options.renderTicks, w, h, radius);
            }
            this.ctx.restore();
            this.ctx.translate(w, h);
            ref1 = this.gp;
            for (l = 0, len1 = ref1.length; l < len1; l++) {
                gauge = ref1[l];
                gauge.update(true);
            }
            return this.ctx.translate(-w, -h);
        };

        return Gauge;

    })(BaseGauge);

    BaseDonut = (function (superClass) {
        extend(BaseDonut, superClass);

        BaseDonut.prototype.lineWidth = 15;

        BaseDonut.prototype.displayedValue = 0;

        BaseDonut.prototype.value = 33;

        BaseDonut.prototype.maxValue = 80;

        BaseDonut.prototype.minValue = 0;

        BaseDonut.prototype.options = {
            lineWidth: 0.10,
            colorStart: "#6f6ea0",
            colorStop: "#c0c0db",
            strokeColor: "#eeeeee",
            shadowColor: "#d5d5d5",
            angle: 0.35,
            radiusScale: 1.0
        };

        function BaseDonut(canvas) {
            this.canvas = canvas;
            BaseDonut.__super__.constructor.call(this);
            if (typeof G_vmlCanvasManager !== 'undefined') {
                this.canvas = window.G_vmlCanvasManager.initElement(this.canvas);
            }
            this.ctx = this.canvas.getContext('2d');
            this.setOptions();
            this.render();
        }

        BaseDonut.prototype.getAngle = function (value) {
            return ((value - this.minValue) / (this.maxValue - this.minValue)) * (this.options.angle * Math.PI)
            // return (this.options.angle) * Math.PI + ((value - this.minValue) / (this.maxValue - this.minValue)) * ((2 + this.options.angle) - (1 - this.options.angle)) * Math.PI;
        };

        BaseDonut.prototype.setOptions = function (options) {
            if (options == null) {
                options = null;
            }
            BaseDonut.__super__.setOptions.call(this, options);
            this.lineWidth = this.canvas.height * this.options.lineWidth;
            this.radius = this.options.radiusScale * (this.canvas.height / 2 - this.lineWidth / 2);
            return this;
        };

        BaseDonut.prototype.set = function (value) {
            this.value = this.parseValue(value);
            if (this.value > this.maxValue) {
                if (this.options.limitMax) {
                    this.value = this.maxValue;
                } else {
                    this.maxValue = this.value;
                }
            } else if (this.value < this.minValue) {
                if (this.options.limitMin) {
                    this.value = this.minValue;
                } else {
                    this.minValue = this.value;
                }
            }
            AnimationUpdater.add(this);
            AnimationUpdater.run(this.forceUpdate);
            return this.forceUpdate = false;
        };

        BaseDonut.prototype.render = function () {
            var displayedAngle, grdFill, h, start, stop, w;
            displayedAngle = this.getAngle(this.displayedValue);
            w = this.canvas.width / 2;
            h = this.canvas.height / 2;
            if (this.textField) {
                this.textField.render(this);
            }
            grdFill = this.ctx.createRadialGradient(w, h, 39, w, h, 70);
            grdFill.addColorStop(0, this.options.colorStart);
            grdFill.addColorStop(1, this.options.colorStop);
            start = this.radius - this.lineWidth / 2;
            stop = this.radius + this.lineWidth / 2;
            this.ctx.strokeStyle = this.options.strokeColor;
            this.ctx.beginPath();
            // total value
            this.ctx.arc(w, h, this.radius, 0, this.options.angle * Math.PI, false);
            this.ctx.lineWidth = this.lineWidth;
            this.ctx.lineCap = "round";
            this.ctx.stroke();
            this.ctx.strokeStyle = grdFill;

            // current value
            this.ctx.beginPath();
            this.ctx.arc(w, h, this.radius, 0, displayedAngle, false);
            return this.ctx.stroke();
        };

        return BaseDonut;

    })(BaseGauge);

    Donut = (function (superClass) {
        extend(Donut, superClass);

        function Donut() {
            return Donut.__super__.constructor.apply(this, arguments);
        }

        Donut.prototype.strokeGradient = function (w, h, start, stop) {
            var grd;
            grd = this.ctx.createRadialGradient(w, h, start, w, h, stop);
            grd.addColorStop(0, this.options.shadowColor);
            grd.addColorStop(0.12, this.options._orgStrokeColor);
            grd.addColorStop(0.88, this.options._orgStrokeColor);
            grd.addColorStop(1, this.options.shadowColor);
            return grd;
        };

        Donut.prototype.setOptions = function (options) {
            var h, start, stop, w;
            if (options == null) {
                options = null;
            }
            Donut.__super__.setOptions.call(this, options);
            w = this.canvas.width / 2;
            h = this.canvas.height / 2;
            start = this.radius - this.lineWidth / 2;
            stop = this.radius + this.lineWidth / 2;
            this.options._orgStrokeColor = this.options.strokeColor;
            // comment this for disable shadow
            // this.options.strokeColor = this.strokeGradient(w, h, start, stop); 
            return this;
        };

        return Donut;

    })(BaseDonut);

    window.AnimationUpdater = {
        elements: [],
        animId: null,
        addAll: function (list) {
            var elem, j, len, results;
            results = [];
            for (j = 0, len = list.length; j < len; j++) {
                elem = list[j];
                results.push(AnimationUpdater.elements.push(elem));
            }
            return results;
        },
        add: function (object) {
            if (indexOf.call(AnimationUpdater.elements, object) < 0) {
                return AnimationUpdater.elements.push(object);
            }
        },
        run: function (force) {
            var elem, finished, isCallback, j, k, l, len, ref, toRemove;
            if (force == null) {
                force = false;
            }
            isCallback = isFinite(parseFloat(force));
            if (isCallback || force === true) {
                finished = true;
                toRemove = [];
                ref = AnimationUpdater.elements;
                for (k = j = 0, len = ref.length; j < len; k = ++j) {
                    elem = ref[k];
                    if (elem.update(force === true)) {
                        finished = false;
                    } else {
                        toRemove.push(k);
                    }
                }
                for (l = toRemove.length - 1; l >= 0; l += -1) {
                    k = toRemove[l];
                    AnimationUpdater.elements.splice(k, 1);
                }
                return AnimationUpdater.animId = finished ? null : requestAnimationFrame(AnimationUpdater.run);
            } else if (force === false) {
                if (AnimationUpdater.animId === !null) {
                    cancelAnimationFrame(AnimationUpdater.animId);
                }
                return AnimationUpdater.animId = requestAnimationFrame(AnimationUpdater.run);
            }
        }
    };

    if (typeof window.define === 'function' && (window.define.amd != null)) {
        define(function () {
            return {
                Gauge: Gauge,
                Donut: Donut,
                BaseDonut: BaseDonut,
                TextRenderer: TextRenderer
            };
        });
    } else if (typeof module !== 'undefined' && (module.exports != null)) {
        module.exports = {
            Gauge: Gauge,
            Donut: Donut,
            BaseDonut: BaseDonut,
            TextRenderer: TextRenderer
        };
    } else {
        window.Gauge = Gauge;
        window.Donut = Donut;
        window.BaseDonut = BaseDonut;
        window.TextRenderer = TextRenderer;
    }

}).call(this);

